import React, { Component } from "react";
// createPortal一个方法，用于将一个组件放到项目的任何地方
// 一般只有对话框，悬浮框，和小提示会使用portal，都是要以窗口为参照进行定位的
import { createPortal } from "react-dom";

class Child extends Component {
  render() {
    // 里面是两个参数，第一个是组件，第二个是需要挂载的容器
    // return createPortal(<div>child组件</div>, document.querySelector("body"));

    return <div>child组件</div>;
  }
}

class App extends Component {
  render() {
    return (
      <div className="wrap">
        <h2>portal</h2>
        {createPortal(<Child />, document.querySelector("body"))}
      </div>
    );
  }
}

export default App;
